﻿<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>dtree</title>
    <link rel="StyleSheet" href="dtree.css" type="text/css" />
    <script type="text/javascript" src="dtree.js"></script>
    <script src="jquery.min.js"></script>
</head>

<body>
    <div class="dtree" id="dtree_div">

        <p><a href="javascript:  d.closeAll();">打开</a> | <a href="javascript: d.openAll();">关闭</a></p>
        <input id="dosearch_text" type="text" />
        <input id="dosearch" type="button" value="查询" onclick="nodeSearching() " />
        <script type="text/javascript">
            d = new dTree('d', true);   //参数一: 树名称。参数二：单选多选 true多选  false单选  默认单选

            d.add(0, -1, '通讯录');
            d.add(1, 0, 'authority', '0001', '一组', true, false);
            d.add(2, 1, 'authority', '0002', '网络', true, false);
            d.add(3, 2, 'authority', '0003', 'ios组 ', true, false);
            d.add(4, 2, 'authority', '0004', '李经理', false, false);
            d.add(5, 2, 'authority', '0005', '张龙', false, false);
            d.add(15, 3, 'authority', '0006', '赵敏', false, false);
            d.add(16, 3, 'authority', '0007', '赵柳', false, false);
            d.add(17, 3, 'authority', '0008', '小分队', true, false);
            d.add(18, 17, 'authority', '0008', '小李', false, false);

            // dTree实例属性以此为：  节点ID，父类ID，name，值，节点名称，是否隐藏checkbox，是否禁用checkbox
            d.add(6, 0, 'authority', '0012', '二组 ', true, false);
            d.add(7, 6, 'authority', '0013', '小队 ', true, false);
            d.add(8, 7, 'authority', '0014', '张三 ', false, false);
            d.add(9, 7, 'authority', '0015', '王五 ', false, false);


            d.add(11, 0, 'authority', '0016', '三组 ', true, false);
            d.add(12, 11, 'authority', '0017', '人事 ', true, false);
            d.add(13, 12, 'authority', '0018', '张经理 ', false, false);
            d.add(14, 12, 'authority', '0019', '小林 ', false, false);
            d.add(20, 0, 'authority', '0020', '总经理', false, false);
            document.write(d);
            d.openAll();
        </script>
    </div>

    <div class="selectorResult">
        选择结果：
        <ul id="ulSelected">
            <!--<li id="user_2_1" uid="1" name="姓名" mytype="2">
                <div class="selectedUser" onmouseover="showRemove(this)" onmouseout="hideRemove(this)" onmousemove="setRemove(this,event)" onclick="doRemove(this,event);" style="cursor: pointer;">
                    姓名
                </div>
            </li>-->
        </ul>
    </div>   
    <!--<div>
        <input type='button' name='bTest' value='test' onclick='test();'>
    </div>-->
    
    <script type="text/javascript">
    function test() {
        var count = 0;
        var obj = document.all.authority;

        for (i = 0; i < obj.length; i++) {
            if (obj[i].checked) {
                alert(obj[i].value);
                count++;
            }
        }
    }
	//搜索节点并展开节点
    function nodeSearching() {
        var dosearch = $.trim($("#dosearch_text").val());//获取要查询的文字
        var $node = $("#dtree_div").find(".dtree_node");
        $node.css('color',"#2b2b2b");
        if(!dosearch)return;
        var dtree_div = $node.show().filter(":contains('" + dosearch + "')").css('color','#FF0000');//获取所有包含文本的节点
        $.each(dtree_div, function (index, element) {
            var s = $(element).attr("node_id");
            d.openTo(s);//根据id打开节点
        });
    }
</script>
<script type="text/javascript">
    //#region 页面执行入口
    $(document).ready(function () {
        //#region 浏览器检测相关方法
        window["MzBrowser"] = {}; (function () {
            if (MzBrowser.platform) return;
            var ua = window.navigator.userAgent;
            MzBrowser.platform = window.navigator.platform;
            MzBrowser.firefox = ua.indexOf("Firefox") > 0;
            MzBrowser.opera = typeof (window.opera) == "object";
            MzBrowser.ie = !MzBrowser.opera && ua.indexOf("MSIE") > 0;
            MzBrowser.mozilla = window.navigator.product == "Gecko";
            MzBrowser.netscape = window.navigator.vendor == "Netscape";
            MzBrowser.safari = ua.indexOf("Safari") > -1;
            if (MzBrowser.firefox) var re = /Firefox(\s|\/)(\d+(\.\d+)?)/;
            else if (MzBrowser.ie) var re = /MSIE( )(\d+(\.\d+)?)/;
            else if (MzBrowser.opera) var re = /Opera(\s|\/)(\d+(\.\d+)?)/;
            else if (MzBrowser.netscape) var re = /Netscape(\s|\/)(\d+(\.\d+)?)/;
            else if (MzBrowser.safari) var re = /Version(\/)(\d+(\.\d+)?)/;
            else if (MzBrowser.mozilla) var re = /rv(\:)(\d+(\.\d+)?)/;
            if ("undefined" != typeof (re) && re.test(ua))
                MzBrowser.version = parseFloat(RegExp.$2);
        })();
    });
    //显示删除
    function showRemove(obj) {
        $(obj).addClass("remove");
    }
    //隐藏删除
    function hideRemove(obj) {
        $(obj).removeClass("remove");
    }
	//鼠标移动到删除图标，显示手（pointer）
    function setRemove(obj, event) {
        var width = $(obj).width();
        var left = $(obj).position().left;
        var e = event || window.event;
        var x = IsIE(GetVersion()) ? e.x : e.pageX;
        if (x > left + width - 9) {
            $(obj).css("cursor", "pointer")
        } else {
            $(obj).css("cursor", "default")
        }
    }
    function GetVersion() { return MzBrowser.version; }
    function GetName() {
        var name = "undefined";
        if (MzBrowser.ie) { name = "ie"; }
        else if (MzBrowser.firefox) { name = "firefox"; }
        else if (MzBrowser.safari) { name = "safari"; }
        return name;
    }
    function IsIE(versionValue) {
        if (versionValue == 11) {
            return IsIE11();
        }
        var name = GetName();
        var version = GetVersion();
        return name == 'ie' && parseInt(version) == versionValue;
    }   
</script>
</body>
</html>



